/**
 * 
 * @authors cherish yii2 (cherish@cherish.pw)
 * @date    2020-12-10 16:48:28
 * @version v1.0
 * @description the core js of todolist project
 * 
 * ━━━━━━神兽出没━━━━━━
 * 　　   ┏┓　 ┏┓
 * 　┏━━━━┛┻━━━┛┻━━━┓
 * 　┃              ┃
 * 　┃       ━　    ┃
 * 　┃　  ┳┛ 　┗┳   ┃
 * 　┃              ┃
 * 　┃       ┻　    ┃
 * 　┃              ┃
 * 　┗━━━┓      ┏━━━┛ Code is far away from bugs with the animal protecting.
 *       ┃      ┃     神兽保佑,代码无bug。
 *       ┃      ┃
 *       ┃      ┗━━━┓
 *       ┃      　　┣┓
 *       ┃      　　┏┛
 *       ┗━┓┓┏━━┳┓┏━┛
 *     　  ┃┫┫　┃┫┫
 *     　  ┗┻┛　┗┻┛
 *
 * ━━━━━━感觉萌萌哒━━━━━━
 */

// 请根据考试说明文档中列出的需求进行作答
// 预祝各位顺利通过本次考试，see you next week！
// ...

load()
// 添加回车事件
$('#title').on('keydown', function (e) {
    if (e.keyCode === 13) {
        //判断有无内容
        if ($(this).val() === '') {
            alert('非法操作')
        } else {
            var local = getData();
            local.push({ title: $(this).val(), done: false });
            saveData(local)
            load()
            $(this).val('');
        }
    }
})

$('ol, ul').on('click', 'a', function () {
    var data = getData();
    var index = $(this).attr('id');
    data.splice(index, 1);
    saveData(data);
    load();
})

$('ol, ul').on('click', 'input', function () {
    var data = getData();
    var index = $(this).siblings('a').attr('id');
    data[index].done = $(this).prop("checked");
    saveData(data);
    load();
})

//封装函数
function getData() {
    var data = localStorage.getItem('todolist');
    if (data !== null) {
        return JSON.parse(data)
    } else {
        return [];
    }
}
function saveData(data) {
    localStorage.setItem('todolist', JSON.stringify(data));
}
function load() {
    var data = getData();
    $('ol, ul').empty();
    var before = 0;
    var after = 0;
    //遍历新数据
    $.each(data, function (i, ele) {
        if (ele.done) {
            $('ul').prepend('<li><input type="checkbox" checked="checked"><p>'
             + ele.title + '</p><a href="javascript:;" id=' + i + ' ></a></li>');
            after++;
        } else { 
            $('ol').prepend('<li><input type="checkbox"><p>' + ele.title + 
            '</p><a href="javascript:;" id=' + i + ' ></a></li>')
            before++;
        }
    })
    $('#todocount').text(before);
    $('#donecount').text(after);
}
